
.music-list{
    -fx-pref-width:400px;
    -fx-pref-height:500px;
    -fx-background-color:rgba(255,255,255,0.7);
    -fx-background-radius: 4px;
    -fx-font-size:14px;
}
.top-box{
    -fx-max-height:0px;
    -fx-padding:5px 10px 5px 10px;
    -fx-background-color:rgb(255,255,255);
    -fx-background-radius:4px 4px 0 0;
}
.top-left-box{
    -fx-alignment:center;
    -fx-spacing:10px;
}
.title-label{
    -fx-font-size:16px;
    -fx-text-fill: #303133;
}
.import-label > .ikonli-font-icon{
    -fx-icon-color:#303133;
    -fx-icon-size: 18px;
}
.import-label:hover > .ikonli-font-icon {
    -fx-icon-color:#409EFF;
}
.hide-but{
    -fx-background-color:transparent;
}
.hide-but > .ikonli-font-icon{
    -fx-icon-color: #303133;
}
.top-right-box{
    -fx-alignment:top-right;
}

.list-box{
    -fx-pref-width:400px;
    -fx-alignment:center;
    -fx-padding:10px 0px 20px 0px;
    -fx-spacing:2px;
}
/*music-item*/
.music-item{
    -fx-max-width:390px;
    -fx-alignment:center;
    -fx-background-color:rgba(255,255,255,0.3);
    -fx-background-radius:3px;
    -fx-padding:3px 6px 3px 6px;
    -fx-spacing:5px;
}
.music-item:hover{
    -fx-background-color:rgba(0,0,0,0.1);
}
.icon-label{
    -fx-min-width:26px;
    -fx-min-height:26px;
    -fx-background-color: rgb(255,255,255,0.7);
    -fx-background-radius:13px;
    -fx-alignment:center;
}
.icon-label > .ikonli-font-icon{
    -fx-icon-size: 16px;
}
.pause-start-but, .delete-but{
    -fx-padding:0px;
    -fx-min-width:26px;
    -fx-pref-height:26px;
    -fx-background-color: rgb(255,255,255,0.7);
    -fx-background-radius:13px;
}
.pause-start-but > .ikonli-font-icon{
    -fx-icon-color:#303133;
}
.pause-start-but:hover{
    -fx-background-color:#409EFF;
}
.delete-but:hover{
    -fx-background-color:#F56C6C;
}
.pause-start-but:hover > .ikonli-font-icon,.delete-but:hover > .ikonli-font-icon{
    -fx-icon-color: rgb(255,255,255);
}
.delete-but > .ikonli-font-icon, .pause-start-but > .ikonli-font-icon{
    -fx-icon-size: 16px;
}
.bottom-box{
    -fx-background-color: rgb(255,255,255);
    -fx-background-radius:0 0 4px 4px;
}
/*分页 Pagination*/
.cf-pagination{
    -fx-page-information-visible: false;
}
.cf-pagination > .pagination-control > .page-information{
    /*-fx-text-fill:red;*/
}
.cf-pagination > .pagination-control .left-arrow-button,
.cf-pagination > .pagination-control .right-arrow-button,
.cf-pagination > .pagination-control .number-button{
    -fx-pref-height:20px;
    -fx-pref-width:20px;
    -fx-background-color: #ebeef5;
    -fx-border-radius: 2px;
    -fx-background-radius: 2px;
}
.cf-pagination > .pagination-control .number-button:hover{
    -fx-text-fill: #409EFF;
}
.cf-pagination > .pagination-control .number-button:selected{
    -fx-background-color: #409EFF;
    -fx-text-fill: #ebeef5;
}
.cf-pagination > .pagination-control .left-arrow-button:hover > .left-arrow,
.cf-pagination > .pagination-control .right-arrow-button:hover > .right-arrow{
    -fx-background-color: #409EFF;
}










/*----------------------------------------------------------滚动条样式*/
.scroll-pane > .viewport{
    /*-fx-background-radius:0 10px 10px 0;*/
    -fx-background-color: transparent;
}

/*scroll-pane*/
.scroll-pane{
    -fx-padding: 0;
    -fx-background-insets: 0;
    -fx-hbar-policy:never;/*不显示水平滚动条*/
    -fx-border-width:0px;
    -fx-background-color: transparent;
}
.scroll-pane > .corner{
    -fx-background-color: transparent;
}
/*scroll-bar*/
.scroll-pane > .scroll-bar{
    /*-fx-block-increment:10000;*/
    -fx-unit-increment:20;
    -fx-background-color: transparent;
}
.scroll-pane > .scroll-bar > .decrement-button > .decrement-arrow,
.scroll-pane > .scroll-bar > .increment-button > .increment-arrow{
    -fx-background-color: transparent;
}
.scroll-pane > .scroll-bar:vertical > .decrement-button,
.scroll-pane > .scroll-bar:vertical > .increment-button{
    -fx-pref-height:0px;
    -fx-pref-width:0.01px;
}
.scroll-pane > .scroll-bar:horizontal > .decrement-button,
.scroll-pane > .scroll-bar:horizontal > .increment-button{
    -fx-pref-width:0px;
    -fx-pref-height:0.01px;
}
.scroll-pane > .scroll-bar > .track{
    -fx-background-radius: 0px;
    -fx-background-color: transparent;
}
.scroll-pane > .scroll-bar:vertical > .thumb, .scroll-pane > .scroll-bar:horizontal > .thumb{
    -fx-background-color: transparent;
    -fx-background-insets: 0px;
    -fx-background-radius: 5px;
}
.scroll-pane:hover > .scroll-bar:vertical > .thumb, .scroll-pane > .scroll-bar:horizontal > .thumb{
    -fx-background-color: rgba(96, 98, 102,0.3);
}
.scroll-pane > .scroll-bar:vertical{
    -fx-padding:10px 0px 10px 0px;
}
.scroll-pane > .scroll-bar:horizontal{
    -fx-padding:0px 10px 0px 10px;
}
.scroll-pane > .scroll-bar:vertical > .thumb, .scroll-pane > .scroll-bar:vertical > .track{
    -fx-background-insets: 0px 0px 0px -10px;
}
.scroll-pane > .scroll-bar:horizontal > .thumb, .scroll-pane > .scroll-bar:horizontal > .track{
    -fx-background-insets: -10px 0px 0px 0px;
}